$btnList: 36,50,
56,
60,
64,
68,
72,
74,
80,
88,
94,
100,
112,;

$roundedList:
4,
8,
12,
14,
16,
20,
24,
28,
32,
36,
40,
44,
48,
54,
64,
80,
100,
136;

[class^="btn-"] {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  border: 2rpx solid transparent;
}

@each $item in $btnList {
  .btn-#{$item} {
    height: $item + rpx;
    line-height: $item + rpx;
		// border-radius: 64rpx;
  }
	.btn-primary-#{$item} {
	  height: $item + rpx;
	  line-height: $item + rpx;
	}
}

@each $item in $roundedList {
  .rounded-#{$item} {
    border-radius: $item + rpx;
  }
	.rounded-t-#{$item} {
	  border-top-left-radius: $item + rpx;
	  border-top-right-radius: $item + rpx;
	}
	.rounded-b-#{$item} {
	  border-bottom-left-radius: $item + rpx;
	  border-bottom-right-radius: $item + rpx;
	}
	.rounded-l-#{$item} {
	  border-top-left-radius: $item + rpx;
	  border-bottom-left-radius: $item + rpx;
	}
	.rounded-r-#{$item} {
	  border-top-right-radius: $item + rpx;
	  border-bottom-right-radius: $item + rpx;
	}
	.rounded-t-l-#{$item} {
	  border-top-left-radius: $item + rpx;
	}
	.rounded-t-r-#{$item} {
	  border-top-right-radius: $item + rpx;
	}
	.rounded-b-l-#{$item} {
	  border-bottom-left-radius: $item + rpx;
	}
	.rounded-b-r-#{$item} {
	  border-bottom-right-radius: $item + rpx;
	}
}

.rounded-full {
  border-radius: 50%;
}
